.pok-application-center {
	.ant-table-fixed-header .ant-table-scroll .ant-table-header::-webkit-scrollbar {
		border: 0;
	}
	.ant-input {
		font-weight: bolder;
		font-size: 15px;
	}
	.title {
		display        : flex;
		justify-content: space-between;

		.left-content {
			display    : flex;
			align-items: center;

			.left-conten-image {
				width : 23px;
				height: 23px;
			}

			.left-conten-text {
				font-weight: 800;
				font-size  : @rok-font-size-big;
				color      : @rok-text-color;
			}
		}

		.right-content {
			display    : flex;
			align-items: center;

			.right-content-search {
				width       : 384px;
				margin-right: 8px;
			}

			.icon-box {
				width        : 34px;
				height       : 34px;
				border       : 1px solid @rok-border-color-base;
				border-radius: @rok-border-radius-base;
				color        : @rok-text-color;
				line-height  : 32px;
				text-align   : center;
				cursor       : pointer;

				.application-icon {
					font-size: 22px;

					&:hover {
						color: @rok-primary-color;
					}
				}
			}
		}
	}
}

.pok-application-category {
	position  : relative;
	display   : flex;
	margin-top: 30px;
	overflow  : hidden;

	.category-list {
		display  : flex;
		flex-wrap: wrap;
		height   : 100%;
		width    : calc(100% - 100px);

		.category-list-item {
			cursor        : pointer;
			margin-right  : 20px;
			font-size     : @rok-font-size-base;
			color         : @rok-text-color-secondary;
			margin-bottom : 16px;
			display       : flex;
			flex-direction: column;
			align-items   : center;
			position      : relative;
			height        : 29px;
			min-width     : 40px;

			.item-text {
				max-width: 100%;
				color    : #1f2329;
				font-weight: bolder;
				&:hover {
					color: @rok-primary-color;
				}
			}
		}

		.tab-active {
			color: @rok-primary-color;

			.item-text {
				color: @rok-primary-color;
			}

			.tab-icon-xiaolian {
				font-size  : 38px;
				height     : 10px;
				line-height: 10px;
				margin-top : 3px;
			}
		}

		.category-list-item::after {
			position   : absolute;
			top        : 0;
			right      : -9px;
			content    : '|';
			margin-left: 8px;
			color      : @rok-Divider-color;
		}

		.category-list-item:last-child::after {
			display: none;
		}
	}

	.more-btn {
		cursor    : pointer;
		display   : block;
		width     : 100px;
		text-align: right;

		span {
			color : @rok-text-color;
			cursor: pointer;
		}

		&:hover {
			color: @rok-primary-hover-color;
		}
	}

	&:after {
		width            : 100%;
		content          : '';
		height           : 1px;
		background       : @rok-Divider-color;
		position         : absolute;
		left             : 0;
		bottom           : 0;
		-webkit-transform: scaleY(0.5);
		transform        : scaleY(0.5);
	}
}

.card-title {
	width       : 100%;
	font-weight : @rok-font-weight-bold;
	font-size   : @rok-font-size-title;
	line-height : 20px;
	color       : @rok-text-color-secondary;
	margin      : 20px 0 20px 10px;
	cursor      : pointer;
	display     : inline-block;
	padding-left: 24px;
	position    : relative;

	&-icon {
		position    : absolute;
		left        : 0;
		margin-right: 6px;
	}
}

.card-box {
	height       : 78px;
	background   : @rok-white-bg;
	border       : 1px solid @rok-Divider-color;
	border-radius: @rok-border-radius-litter-big;
	cursor       : pointer;

	&:hover {
		box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.08);

		.card-favorite {
			display: block;
		}
	}

	.ant-card-body {
		padding: 15px;
		display: flex;

		.card-box-icon {
			min-width   : 24px;
			height      : 24px;
			width       : 24px;
			margin-right: 8px;

			img {
				width        : 100%;
				height       : 100%;
				border-radius: 9px;
			}
		}

		.card-box-right {
			width: calc(100% - 80px);

			.right-title {
				width        : 100%;
				font-weight  : @rok-font-weight-bold;
				font-size    : @rok-font-size-title;
				line-height  : 20px;
				color        : @rok-text-color;
				overflow     : hidden;
				white-space  : nowrap;
				text-overflow: ellipsis;
			}

			.right-detail {
				font-size    : @rok-font-size-base;
				color        : @rok-mobile-text-color-secondary;
				margin-top   : 4px;
				width        : 100%;
				overflow     : hidden;
				white-space  : nowrap;
				text-overflow: ellipsis;
				display      : flex;
				align-items  : center;
				line-height  : 16px;

				.ant-avatar-sm,
				.right-detail-admin {
					height      : 16px;
					width       : 16px;
					margin-right: 5px;
				}

				.right-detail-admin {
					border-radius: 50%;
					color        : #fff;
					text-align   : center;
					font-size    : 12px;
					line-height  : 16px;
				}
			}
		}
	}

	// .card-box-icon {
	// 	width: 24px;
	// 	height: 24px;
	// 	margin-right: 8px;
	// }
	.card-collected,
	.card-favorite {
		margin-top     : -15px;
		min-width      : 25px;
		text-align     : center;
		line-height    : 35px;
		width          : 25px;
		height         : 35px;
		background-size: 100% 100%;
		margin-left    : 5px;

		.collected {
			color: @rok-collected-color;
		}
	}

	.card-favorite {
		display: none;
		color  : @rok-mobile-disabled-color;

		&:hover {
			color: @rok-collected-color;
		}
	}
}

.card-all {
	display        : flex;
	align-items    : center;
	justify-content: center;
	background     : @rok-table-header-color;
	border         : none;

	&-text {
		margin-left: 4px;
		color      : @rok-auxiliary-color;
		font-size  : @rok-font-size-title;
	}
}

.pok-no-data {
	margin-top: 150px;
}

.list-table,
.list-table-all {
	.ant-table-row {
		cursor: pointer;
	}

	.ant-table-thead>tr>th,
	.ant-table-tbody>tr>td {
		padding: 7px 16px;
	}

	.ant-table-scroll .ant-table-header table tr>th {
		border-bottom: none;
	}

	td,
	th {
		border-right: 1px solid @rok-mobile-Divider-color;
	}

	th {
		border-bottom: none;
	}

	td:last-child,
	th:last-child {
		border-right: none;
	}

	.iconshoucang {
		color: @rok-collected-color;
	}

	.icondaishoucang {
		color: @secondary-border-base;

		&:hover {
			color: @rok-collected-color;
		}
	}

	.custom-person {
		display    : flex;
		align-items: center;

		.custom-person-name {
			margin-left: 6px;
		}
	}

	.custom-operation {
		cursor    : pointer;
		text-align: center;
	}

	.list-table-name {
		display: flex;

		img {
			width        : 24px;
			height       : 24px;
			border-radius: 9px;
			margin-right : 15px;
		}

		.name-text {
			width: calc(100% - 50px);
		}
	}
}

.list-table-all {
	margin-top: 20px;
}

.table-all {
	width          : 227px;
	height         : 40px;
	background     : @rok-table-header-color;
	border         : 1px solid @rok-mobile-Divider-color;
	margin         : 16px auto 0 auto;
	border-radius  : 6px;
	cursor         : pointer;
	display        : flex;
	align-items    : center;
	justify-content: center;

	&-text {
		margin-left: 4px;
		color      : @rok-auxiliary-color;
		font-size  : @rok-font-size-title;

		&:hover {
			color: @rok-text-color;
		}
	}
}

@media (min-width: 0px) and (max-width: 1280px) {

	.card-row-CardStyleA,
	.card-row-CardStyleB,
	.card-row-CardStyleC {
		.ant-col {
			display  : block;
			flex     : 0 0 33.33333333%;
			max-width: 0 0 33.33333333%;
		}
	}
}

@media (min-width: 1281px) and (max-width: 1920px) {

	.card-row-CardStyleA,
	.card-row-CardStyleB,
	.card-row-CardStyleC {
		.ant-col {
			display  : block;
			flex     : 0 0 25%;
			max-width: 25%;
		}
	}
}

@media screen and (min-width: 1921px) {

	.card-row-CardStyleA,
	.card-row-CardStyleB,
	.card-row-CardStyleC {
		.ant-col {
			display  : block;
			flex     : 0 0 16.66666666%;
			max-width: 16.66666666%;
		}
	}
}

.card-row-CardStyleA,
.card-row-CardStyleB,
.card-row-CardStyleC {
	.card-all {
		.ant-card-body {
			display       : flex;
			flex-direction: row !important;
		}
	}
}

.card-all {
	display        : flex;
	align-items    : center;
	justify-content: center;
	background     : @rok-table-header-color;
	border         : none;

	&-text {
		margin-left: 4px;
		color      : @rok-auxiliary-color;
		font-size  : @rok-font-size-title;
	}
}

.card-row-CardStyleC {
	.card-box {
		height: 90px;
	}
}

.card-row-CardStyleD {
	.ant-col {
		display  : block;
		flex     : 0 0 136px;
		max-width: 136px;
	}

	.card-box {
		height  : 120px;
		overflow: auto;
		position: relative;
		cursor  : pointer;
	}
}

.title-types {
	background   : @rok-white-bg;
	opacity: 0.9;
	border-radius: 11px;
	padding: 12px 12px;
}

.shu-icon {
	display: inline-block;
	width: 3px;
	height: 16px;
	background: #4c78fc;
	vertical-align: middle;
	&:before {
		content: ''
	}
}

.list {
	height: 56vh;
	overflow: auto;
	margin-top:  @rok-basic-margin;
}

